<%
/**
 * first wizard page / tab
 *
 * @author	Jeroen Wesbeek <work@osx.eu>
 * @package AjaxFlow
 */
%>
<script type="text/javascript" >
 function remappingBean(){
<g:if test="${customer?.bornProvince}">
 $("#born_province").select2('data',{id:${customer?.bornProvince.id},text:'${customer?.bornProvince.nome}'});
</g:if>
<g:if test="${customer?.bornMunicipality}">
$("#born_municipality").append($('<option>', {value:"${customer?.bornMunicipality?.id}", text: "${customer?.bornMunicipality?.nome}"}));
$("#born_municipality").select2("val","${customer?.bornMunicipality?.id}");
</g:if>
 
 <g:if test="${customer?.residence}">
 $("#residence_province").select2('data',{id:${customer?.residence.province.id},text:'${customer?.residence.province.nome}'});
 $("#residence_municipality").append($('<option>', {value:"${customer?.residence?.municipality?.id}", text: "${customer?.residence?.municipality?.nome}"}));
 $("#residence_municipality").select2("val","${customer?.residence?.municipality?.id}");
 </g:if>
<g:if test="${customer?.abode}">
$("#abode_province").select2('data',{id:${customer?.abode.province.id},text:'${customer?.abode.province.nome}'});
$("#abode_municipality").append($('<option>', {value:"${customer?.abode?.municipality?.id}", text: "${customer?.abode?.municipality?.nome}"}));
$("#abode_municipality").select2("val","${customer?.abode?.municipality?.id}");
 </g:if>

 <g:if test="${customer?.personaGiuridica?.pgResidence}">
 $("#pgResidence_province").select2('data',{id:${customer?.personaGiuridica?.pgResidence.province.id},text:'${customer?.personaGiuridica?.pgResidence.province.nome}'});
 $("#pgResidence_municipality").append($('<option>', {value:"${customer?.personaGiuridica?.pgResidence?.municipality?.id}", text: "${customer?.personaGiuridica?.pgResidence?.municipality?.nome}"}));
 $("#pgResidence_municipality").select2("val","${customer?.personaGiuridica?.pgResidence?.municipality?.id}");
 </g:if>

 <g:if test="${interview?.id && interview?.user}">
	${remoteFunction(
			controller:'Interview',
			params: [interviewId: interview?.id],
			action:'renderAnomalieBancarieList',
			update:'render_anomalieBancarieList',
			onSuccess:'readOnly();toUpperCase();')}
 </g:if>
 
 }
 </script>
<af:page>
<div class="alert alert-danger fade in" id="validity_label"></div>
	<g:if test="${interview}">
		<div class="col-sm-3 col-md-offset-9">
			<h3>Intervista : <exdutility:number_interview value="${interview?.id }"/></h3>
		</div>
	</g:if>
	
<div class="row">
	<div class="col-lg-12">
		<div class="portlet portlet-default">	
			<div class="portlet-body">
				<ul id="myTab" class="nav nav-tabs">
					<g:if test="${(customer?.personaGiuridica?.pgCf || customer?.personaGiuridica?.pgPiva)  && customer?.personaGiuridica?.pgName}">				
						<li class="">
							<a data-toggle="tab" href="#home"><b>Persona Fisica</b></a>
						</li>
						<li class="active">
							<a data-toggle="tab" href="#profile"><b>Persona Giuridica</b></a>
						</li>
					</g:if><g:else>	
						<li class="active">
							<a data-toggle="tab" href="#home"><b>Persona Fisica</b></a>
						</li>
						<li class="">
							<a data-toggle="tab" href="#profile"><b>Persona Giuridica</b></a>
						</li>
					</g:else>
				</ul>

<div id="myTabContent" class="tab-content">

<g:if test="${(customer?.personaGiuridica?.pgCf || customer?.personaGiuridica?.pgPiva)  && customer?.personaGiuridica?.pgName}">
	<div id="home" class="tab-pane fade">
</g:if><g:else>	
	<div id="home" class="tab-pane fade active in">
</g:else>

<h3>Anagrafica Persona Fisica</h3>
<div class="row">
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-user fa-lg fa-fw"></i></span>
				<input class="form-control input-md" placeholder="Cognome (obbligatorio)" type="text" name="surname" id="surname" value="${customer?.surname}">
			</div>
			<div class="col-sm-12" align="right">
				<div class="note">
					<strong>Cognome della persona fisica o dell'intervistato</strong>
				</div>
			</div>				
		</div>
	</div>
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-user fa-lg fa-fw"></i></span>
				<input  class=" form-control input-md" placeholder="Nome (obbligatorio)" type="text" name="name" id="name" value="${customer?.name}">
			</div>
			<div class="col-sm-12" align="right">
				<div class="note">
					<strong>Nome della persona fisica o dell'intervistato</strong>
				</div>
			</div>	
		</div>
	</div>
</div>
	
<div class="row" style="margin-top:15px">
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-info fa-lg fa-fw"></i></span>
				<input class="form-control input-md" placeholder="CF / P.iva (obbligatorio)" type="text" name="cf_piva" id="cf_piva" value="${customer?.cf_piva}">
			</div>
		</div>
	</div>
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i id="born_datepicker" class="fa  fa-calendar fa-lg fa-fw"></i></span>
				<input
                        	type="text" 
                        	placeholder="Data Nascita"
							name="born"
							id="born"
							value="${formatDate(format:'dd/MM/yyyy',date:customer?.born)}" 
							class="form-control input-md"
							onchange="${remoteFunction(
								asynchronous: false,
	            				action:'calculate_age',
								controller:'interview',
								params:'\'born=\' + this.value',
								onSuccess: 'showAge(data,textStatus);'
								
								)}"	
											
                        />
			</div>
		</div>
	</div>
</div>

<div class="row">
	<div class="col-sm-1 col-md-offset-1">
		<div class="smart-form inline-group">
			<label class="radio">
				<input type="radio" name="sex" class="checkbox_sex" value="U" <g:if test="${customer?.sex=='U' || (!customer) }">checked</g:if>>
				<i></i>Uomo</label>	
		</div>
	</div>
	<div class="col-sm-1 ">
		<div class="smart-form inline-group">
			<label class="radio">
				<input type="radio" name="sex" class="checkbox_sex" value="D" <g:if test="${customer?.sex=='D' }">checked</g:if>>
				<i></i>Donna</label>
		</div>
	</div>
	<div class="col-sm-3 ">	
			<div class="form-group">
				<div class="input-group">
					<span class="input-group-addon"><i class="fa  fa-info fa-lg fa-fw"></i></span>
					<input class="form-control input-md" readonly placeholder="Et&agrave;" type="text" name="age" id="age" value="${customer?.age}">
	
				</div>
			</div>
	</div>
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-map-marker fa-lg fa-fw"></i></span>
					<input style="width:100%" data-placeholder="Provincia di nascita" class="input-md" name="born_province" id="born_province" />
			</div>
		</div>
	</div>
</div>

<div class="row">
	<div class="col-sm-5 col-md-offset-7">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-map-marker fa-lg fa-fw"></i></span>									
				<select style="width:100%" data-placeholder="Comune di Nascita" class="input-md" name="born_municipality" id="born_municipality" >
					<option></option>
				</select>
			</div>
		</div>
	</div>
</div>

<h3>Residenza</h3>
<div class="row">
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-map-marker fa-lg fa-fw"></i></span>
				<input style="width:100%" data-placeholder="Provincia" class="input-md" name="residence_province" id="residence_province" />
			</div>
		</div>
	</div>
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-map-marker fa-lg fa-fw"></i></span>
				<select style="width:100%" data-placeholder="Comune" class="input-md" name="residence_municipality" id="residence_municipality" >
					<option></option>
				</select>
			</div>
		</div>
	</div>
</div>

<div class="row">
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-map-marker fa-lg fa-fw"></i></span>
				<input class="form-control input-md" placeholder="CAP" type="text" name="residence_cap" id="residence_cap" 
						readonly="readonly" value="${customer?.residence?.cap}">
			</div>
		</div>
	</div>
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-map-marker fa-lg fa-fw"></i></span>
				<input style="width:100%" placeholder="Indirizzo" class="form-control input-md" name="residence_address" 
						id="residence_address" value="${customer?.residence?.address}"/>
			</div>
		</div>
	</div>
</div>


<%--//DOMICILIO--%>
<br/><br/>
<div class="panel-group smart-accordion-default" id="accordion-2">
	<div class="panel panel-default">
		<div class="panel-heading">
			<h4 class="panel-title"><a data-toggle="collapse" data-parent="#accordion-2" href="#collapseOne-1" class="collapsed"> 
				<i class="fa fa-fw fa-plus-circle txt-color-green"></i> 
					<i class="fa fa-fw fa-minus-circle txt-color-red"></i>Domicilio (se diverso da residenza)</a></h4>
		</div>
		<g:if test="${customer?.abode?.id}">
			<div id="collapseOne-1" class="panel-collapse collapse in">
		</g:if>
		<g:else>
			<div id="collapseOne-1" class="panel-collapse collapse">
		</g:else>
		
<div class="panel-body" style="background: url(/site/img/mybg.png) #fff;">
	<div class="row">
		<div class="col-sm-5 col-md-offset-1">
			<div class="form-group">
				<div class="input-group">
					<span class="input-group-addon"><i class="fa fa-map-marker fa-lg fa-fw"></i></span>
					<input style="width:100%" data-placeholder="Provincia" class="input-md" 
						name="abode_province" id="abode_province" onblur=""/>
				</div>
			</div>
		</div>
		<div class="col-sm-5 col-md-offset-1">
			<div class="form-group">
				<div class="input-group" id="input-group-abode_municipality">
					<span class="input-group-addon"><i class="fa fa-map-marker fa-lg fa-fw"></i></span>
					<select style="width:100%" data-placeholder="Comune" class="input-md" name="abode_municipality" id="abode_municipality" >
						<option></option>									
					</select>									
				</div>
			</div>
		</div>
	</div>

	<div class="row">
		<div class="col-sm-5 col-md-offset-1">
			<div class="form-group">
				<div class="input-group">
					<span class="input-group-addon"><i class="fa fa-map-marker fa-lg fa-fw"></i></span>
					<input class="form-control input-md" placeholder="CAP" type="text" name="abode_cap" id="abode_cap" 
						readonly="readonly" value="${customer?.abode?.cap}">
				</div>
			</div>
		</div>
		<div class="col-sm-5 col-md-offset-1">
			<div class="form-group">
				<div class="input-group">
					<span class="input-group-addon"><i class="fa fa-map-marker fa-lg fa-fw"></i></span>
					<input style="width:100%" placeholder="Indirizzo" class="form-control input-md" name="abode_address" 
							id="abode_address" value="${customer?.abode?.address}"/>
				</div>
			</div>
		</div>
	</div>
</div>
		</div>
	</div>
</div>
	
<br/>
<h3>Contatti</h3>
<div class="row">
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-phone fa-lg fa-fw"></i></span>
				<input  style="width:100%" placeholder="Telefono" class="form-control input-md" 
						name="phone" id="phone"  value="${customer?.phone}"/>
			</div>
		</div>
	</div>
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-mobile-phone fa-lg fa-fw"></i></span>
				<input  style="width:100%" placeholder="Cellulare" class="form-control input-md" name="mobile" id="mobile" value="${customer?.mobile}"/>
			</div>
		</div>
	</div>
</div>

<div class="row">
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-envelope fa-lg fa-fw"></i></span>
				<input class="form-control input-md" placeholder="Email" type="text" name="email" id="email" value="${customer?.email}">
			</div>
		</div>
	</div>
</div>

	
	</div>
	
<%-- -------------- Pagina seconda del tab -------------------------- --%>

<g:if test="${(customer?.personaGiuridica?.pgCf || customer?.personaGiuridica?.pgPiva)  && customer?.personaGiuridica?.pgName}">
	<div id="profile" class="tab-pane fade active in">
</g:if><g:else>	
	<div id="profile" class="tab-pane fade">
</g:else>
	
	
<h3>Informazioni Persona Giuridica</h3>	
<div class="row">
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-user fa-lg fa-fw"></i></span>
				<input  class="form-control input-md" placeholder="Denominazione Sociale (obbligatorio)" 
					type="text" name="pgName" id="pgName" value="${customer?.personaGiuridica?.pgName}">

			</div>
		</div>
	</div>
</div>

<div class="row">
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-info fa-lg fa-fw"></i></span>
				<input class="form-control input-md" placeholder="Cod Fisc" type="text" name="pgCf" id="pgCf" value="${customer?.personaGiuridica?.pgCf}">
			</div>
		</div>
	</div>
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-info fa-lg fa-fw"></i></span>
				<input class="form-control input-md" placeholder="P.iva" type="text" name="pgPiva" id="pgPiva" value="${customer?.personaGiuridica?.pgPiva}">
			</div>
		</div>
	</div>
</div>	
	
<h3>Domicilio Fiscale</h3>
<div class="row">
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-map-marker fa-lg fa-fw"></i></span>
				<input style="width:100%" data-placeholder="Provincia" class="input-md" name="pgResidence_province" id="pgResidence_province" />
			</div>
		</div>
	</div>
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-map-marker fa-lg fa-fw"></i></span>
				<select style="width:100%" data-placeholder="Comune" class="input-md" name="pgResidence_municipality" id="pgResidence_municipality" >
					<option></option>
				</select>
			</div>
		</div>
	</div>
</div>

<div class="row">
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-map-marker fa-lg fa-fw"></i></span>
				<input class="form-control input-md" placeholder="CAP" type="text" name="pgResidence_cap" id="pgResidence_cap" 
						readonly="readonly" value="${customer?.personaGiuridica?.pgResidence?.cap}">
			</div>
		</div>
	</div>
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-map-marker fa-lg fa-fw"></i></span>
				<input style="width:100%" placeholder="Indirizzo" class="form-control input-md" name="pgResidence_address" 
						id="pgResidence_address" value="${customer?.personaGiuridica?.pgResidence?.address}"/>
			</div>
		</div>
	</div>
</div>

<br/>
<h3>Contatti</h3>
<div class="row">
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-phone fa-lg fa-fw"></i></span>
				<input  style="width:100%" placeholder="Telefono" class="form-control input-md" 
						name="pgPhone" id="pgPhone"  value="${customer?.personaGiuridica?.pgPhone}"/>
			</div>
		</div>
	</div>
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-mobile-phone fa-lg fa-fw"></i></span>
				<input data-mask="+39 999 9999999" data-mask-placeholder="X" style="width:100%" 
						placeholder="Cellulare" class="form-control input-md" name="pgMobile" id="pgMobile" value="${customer?.personaGiuridica?.pgMobile}"/>
			</div>
		</div>
	</div>
</div>

<div class="row">
	<div class="col-sm-5 col-md-offset-1">
		<div class="form-group">
			<div class="input-group">
				<span class="input-group-addon"><i class="fa fa-envelope fa-lg fa-fw"></i></span>
				<input class="form-control input-md" placeholder="Email" type="text" name="pgEmail" id="pgEmail" value="${customer?.personaGiuridica?.pgEmail}">
			</div>
		</div>
	</div>
</div>
	
	
	
	</div>			
</div>


			</div>
		</div>
	</div>

				

<div class="row">
	<div class="col-lg-12">
		</br></br></br>

		<div class="col-sm-12">
			<h3>Rapporti Bancari</h3>
	
		<div id="render_anomalieBancarieList"></div>
				
			<div class="row">
				<div align="center" class="col-sm-10">
							<h6>Prosegui con:</br></br></h6>	
				</div>
			</div>	
			<div class="row">
				<div align="center" class="col-sm-2 col-md-offset-2">
					<input type="button" name="nab" class="btn btn-md btn-success" value="Rapporti Bancari"		
							onClick="showAnomaliaBancariaType();"> 
					&nbsp;&nbsp;
				</div>
				<div align="center" class="col-sm-1 col-md-offset-2">
				<g:set var="showNext" value="${page<pages.size}"/>
					<af:navigation events="[next:[label:'Sovraindebitamento', show:showNext]]" 
							separator="" class="btn btn-md btn-primary">
					</af:navigation>
				</div>				
			</div>

			<div id="render_anomaliaBancaria"></div>				
			</br></br></br></br></br>
		</div>
	</div>

</div>

<div style="border-top: 2px solid #006DBA; padding-top: 2px;"></div>
</af:page>

